<template>
  <div class="staging">
    <div class="box">
      <a-tabs default-active-key="1" @change="callback">
        <a-tab-pane key="1" tab="Tab 1">
          <standingBook></standingBook>
        </a-tab-pane>
        <a-tab-pane key="2" tab="Tab 2" force-render>
          Content of Tab Pane 2
        </a-tab-pane>
      </a-tabs>
    </div>
    <div>
      <router-view />
    </div>
  </div>
</template>
<script>
import standingBook from './plan/standingBook'
export default {
  name: 'Index',
  components:{ standingBook },
  data() {
    return {
      tabs: {
        items: [
          {
            key: '1',
            title: '统计图标'
          },
          {
            key: '2',
            title: '数据报表'
          }
        ],
        active: () => {
          switch (this.$route.path) {
            case '/managementStandingBook':
              return '1'
            case '/backlog/list':
              return '2'
          }
        },
        callback: key => {
          switch (key) {
            case '1':
              this.$router.push('/managementStandingBook')
              break
            case '2':
              this.$router.push('/backlog/list')
              break
          }
        }
      },
      search: true,
      tabStatus: 'addTab'
    }
  }
}
</script>

<style scoped>
/deep/.ant-tabs-nav-scroll{
  background-color: white;
  padding: 10px;
}
</style>
